<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<ui:composition template="./template.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets">
       
    <ui:define name="conteudo" > 
        
    <p:focus />
        
    <p:panel id="painelNovo" header="Cadastrar Cliente" visible="false" 
             style="margin-top: 50px;width: 600px">
        
         <p:effect type="clip" event="load" for="painelNovo" speed="1000">
                    <f:param name="mode" value="'show'" />  
         </p:effect>
        
        <h:form id="formMensagem">
            
            <p:messages  id="mensagemNovo"  autoUpdate="true" >
                
                <p:effect type="clip" event="load" for="mensagemNovo" delay="3000" speed="1000" />
            
            </p:messages>
        
        </h:form>
        
            <h:form  id="formNovo" >
            
                <h:panelGrid columns="2" cellpadding="5">
                                                            
                    <h:outputLabel for="nome" value="Nome: " /> 
                    <p:inputText value="#{clienteMB.cliente.nome}" id="nome" required="true"   
                                 requiredMessage="'Nome' é obrigatório."/>
                    
                    <h:outputLabel for="usuario" value="Usuário: "  />
                    <p:inputText value="#{clienteMB.cliente.usuario}" id="usuario" required="true" 
                                 requiredMessage="'Usuário' é obrigatório."/>     
                                        
                    <h:outputLabel for="senha" value="Senha: "  />
                    <p:password value="#{clienteMB.cliente.senha}" id="senha" required="true" 
                                 requiredMessage="'Senha' é obrigatório."/>     
                    
                    <h:outputLabel for="idade" value="Idade: " />
                    <p:inputText widgetVar="idade" value="#{clienteMB.cliente.idade}" id="idade" required="true" 
                                 requiredMessage="'Idade' é obrigatório."
                                 converterMessage="'Idade' deve ser numérica."/>     
                    
                    <h:outputLabel for="sexo" value="Sexo: " /> 
                    
                    <p:selectOneMenu  value="#{clienteMB.cliente.sexo}" id="sexo" required="true" >  
                        <f:selectItem itemLabel="Masculino" itemValue="Masculino" />  
                        <f:selectItem itemLabel="Feminino" itemValue="Feminino" />  
                    </p:selectOneMenu>  
                                        
                    <h:outputLabel for="cpf" value="CPF " />  
                    
                    <p:inputMask mask="999.999.999-99"  value="#{clienteMB.cliente.cpf}" id="cpf" required="true" 
                                 requiredMessage="'CPF' é obrigatório."/>     
                    
                                                            
                </h:panelGrid>

                <center>
                    <p:commandButton id="btnSalvar" value="Salvar"
                                      action="#{clienteMB.salvar}" ajax="true" />
                    
                </center> 
                
                 <p:defaultCommand target="btnSalvar"/>
            </h:form>
            
            <p:spacer width="0px" height="5px"/>
            
            <center>
                <h:form>
                <p:commandLink ajax="false" value="Voltar"  action="login"/>
                </h:form>
            </center>

    </p:panel>
   
        </ui:define>
</ui:composition>